<template>
	<view style="width: 100vw;background-color: #FC6A1D;">
		<!--顶部图片 -->
		<view style="width: 100vw;height: 30vh;">
			<image src="/static/images/LbarginActiveImg_02.png" style="width: 100vw;height: 30vh;" mode=""></image>
		</view>
		<!-- 正在进行中 -->
		<view style="background-color: #fff; width: 90vw;margin-left: 5vw;border: solid 1px orange;height: 35vh;margin-top: 2vh; border-radius: 15px 15px 0px 0px;">
			<!-- 类型 -->
			<view style="width: 90.3vw;height: 6vh;color: #fff; text-align: center;line-height: 6vh; background-color: #FEBF12;border-radius: 15px 15px 0px 0px">
				正在进行中
			</view>
			<!-- 商品内容 -->
			<view style="width: 90vw;height: 29vh;display: flex;">
				<view style="width: 40vw;height: 29vh;">
					<image src="/static/images/LKongqizhaguo.png" style="width: 34vw;height: 26vh;margin-left: 2vw;" mode=""></image>
				</view>
				<!-- 右侧 -->
				<view style="width: 50vw;height: 29vh;">
					<view style="width: 50vw;height: 8vh;font-size: 0.9rem;font-weight: bold; color: #6A6350;line-height: 8vh;">
						已砍成<text style="color: #B55D59;font-weight: bold;">15890.1</text>元，仅差<text style="color: #B55D59;font-weight: bold;">0.06%</text>
					</view>
					<!-- 进度条 -->
					<view style="width: 46vw;margin-left: 2vw;height: 2vh;border-radius: 10px;background-color: #FD6E04;"></view>
					<!-- 倒计时 -->
					<view style="width: 46vw;margin-left: 2vw;margin-top: 2vh;display: flex;font-size: 0.8rem;color: #885A0c;">
					<uni-countdown color="#FFFFFF" background-color="#885A0C" border-color="#00B26A" :day="1" :hour="2" :minute="30" :second="0"></uni-countdown>
						后结束
					</view>
					<!-- 继续砍价 -->
					<view style="width: 40vw;margin-left: 5vw;height: 6vh;margin-top: 2vh;color: #fff; text-align: center;line-height: 6vh; border-radius: 25px;background-color: #FB5A09;">
						继续砍价
					</view>
				</view>
			</view>
		</view>
		
		<!-- 已完成 -->
		<view style="background-color: #fff; width: 90vw;margin-left: 5vw;border: solid 1px orange;height: 35vh;margin-top: 2vh; border-radius: 15px 15px 0px 0px;">
			<!-- 类型 -->
			<view style="width: 90.3vw;height: 6vh;color: #fff; text-align: center;line-height: 6vh; background-color: #FEBF12;border-radius: 15px 15px 0px 0px">
				已完成
			</view>
			<!-- 商品内容 -->
			<view style="width: 90vw;height: 29vh;display: flex;">
				<view style="width: 40vw;height: 29vh;">
					<image src="/static/images/LKongqizhaguo.png" style="width: 34vw;height: 26vh;margin-left: 2vw;" mode=""></image>
				</view>
				<!-- 右侧 -->
				<view style="width: 50vw;height: 29vh;">
					<view style="margin-top: 3vh; width: 50vw;height: 8vh;font-size: 0.9rem;color: #CC3300;line-height: 8vh;">
						恭喜你
					</view>
					<!-- 内容-->
					<view style="margin-top: 5vh;font-size: 0.8rem;">
						砍成一台压力锅，宝贝正在打包，请注意查收
					</view>
				</view>
			</view>
		</view>
		<!-- 其他内容 -->
		<view style="width: 100vw;background-color: #FB6317;margin-top: 2vh;" >
			<view 
				style="display: flex;justify-content: space-around;flex-wrap: wrap; padding-top: 2vh;width: 92vw;margin-left: 4vw;background-color: #FEDFB4;border-radius: 10px;box-shadow: 2px -2px 4px 5px #FAB188; ">
				<!-- 商品信息 -->
				<view
					style="border: solid 1px #FBE4BE; width: 40vw;margin-left: 1vh;background-color: #FFF1DE;border-radius: 10px;" v-for="(item,index) in List">
					<!-- 已送出多少件 -->
					<view
						style="font-size: 0.6rem;color: #957042;text-align: center;line-height: 5vh;font-weight: bold; width: 25vw;height: 5vh; margin-left: 7vw;background-color: #FDDDAE;border-radius: 0px 0px  20px 20px; ">
						已送出<text style="font-size: 0.8rem;font-weight: bold;color: #D2332E;">11.2万</text>件
					</view>
					<!-- 商品名称 -->
					<view
						style="width: 40vw;text-align: center;height: 8vh;line-height: 8vh;font-size: 1.1rem;font-weight: bold;color: #6A5436;">
						九阳空气炸锅
					</view>
					<!-- 图片 -->
					<view style="width: 40vw;height: 23vh;">
						<image :src="item.img" style="width: 40vw;height: 23vh;" mode=""></image>
					</view>
					<view style="width: 40vw;height: 1vh;background-color:#FDDDB4 ;"></view>
					<!-- 免费拿点击按钮 -->
					<view style="width: 40vw;height: 8vh;background-color: #FDDDB4;">
						<button style="width: 34vw;margin-left: 3vw;height: 6vh;border-radius: 25px;color: #fff;text-align: center;line-height: 6vh; background-color: #F53305;">
							点击免费
						</button>
					</view>
		
		
				</view>
		
			</view>
		
		
		</view>
		
		
		
		
		
		
	</view>
</template>

<script>
	// import progress from'components/ai-progress/ai-progress.vue'
	export default{
		data(){
			return{
				List:[
					{
						img:'/static/images/LKongqizg.png',
						title:'九阳空气炸锅'
					},
					{
						img:'/static/images/LKongqizg.png',
						title:'九阳空气炸锅'
					},
					{
						img:'/static/images/LKongqizg.png',
						title:'九阳空气炸锅'
					},
					{
						img:'/static/images/LKongqizg.png',
						title:'九阳空气炸锅'
					},
				]
			}
		},
		components:{
			
		}
	}
</script>

<style>
</style>
